<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../vue.js"></script>
    <script src="../vue-router.js"></script>
<!--    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>-->
<!--    <script src="../_axios@0.18.0@axios/lib/axios.js"></script>-->
    <script src="../axios.min.js"></script>
</head>
<body>
<div id="app">
    <App></App>
</div>
<script>
    Vue.prototype.$axios = axios

    var App = {
        template:`<div><h1>我是入口组件</h1>
                    <button @click="sendAjax">axios发送GET请求</button>
                    <button @click="sendPost">axios发送POST请求</button>
                    </div>`,
        methods:{
            sendAjax(){
                this.$axios.get('http://127.0.0.1:8000/fs/ajax1.html?p=123')
                    .then(res=>{
                        console.log(res)
                        console.log(res.data)
                    }).catch(err=>{
                        console.log(err)
                })
            },
            sendPost(){
                this.$axios.defaults.baseURL='http://127.0.0.1:8000/'
                this.$axios.post('fs/f1.html',{
                    user: 'Fred',
                    pwd: 'Flintstone',
                    email:'1233@qq.com',
                    age:'20'
                })
                    .then(res=>{
                        console.log(res)
                        console.log(res.data)
                    }).catch(err=>{
                    console.log(err)
                })
            }

        }
    }

    new Vue({
        el: '#app',
        data:{
            msg : 'Hello World',
        },
        components:{
            App
        }
    })
</script>
</body>
</html>
